<template>
	<view class="content">

		<view class="item" v-for="(val,index) in list" :key='index'>
			<view @click="btn_item(index)" class="title">
				<i class="iconfont iconwenjianjia icon-css"></i>
				<text>{{val.menu_name}}</text>
			</view>
			<view :class="{is_show:val.isshow}" class="item_content">
				<view class="item_content_title" v-for="(value,id) in val.question" :key="id" @click="gotodetail(index,id)">
					<i class="iconfont iconwenti icon-css-content"></i>
					<text>{{value.question_text}}</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isshow: true,
				list: []
			}
		},
		onLoad() {
			var token = uni.getStorageSync('token');
			this.$gapi.apiPost('user/help/lists', {
				k_token: token,
				type: 3
			}).then(res => {
				if (res.data.code == 200) {
					this.list = res.data.data;
					if (this.list.length == 0) {
						uni.showToast({
							title: '你还没有问题反馈呢！',
							icon: 'none'
						});
					} else {
						for (let i = 0; i < this.list.length; i++) {
							this.list[i].isshow = true;
						}
					}
					this.$forceUpdate();
				}else{
					uni.showToast({
						title: '你还没有问题反馈呢！',
						icon: 'none'
					});
				}
			});
		},
		methods: {
			btn_item: function(index) {
				this.list[index].isshow = !this.list[index].isshow;
				this.$forceUpdate();
			},
			gotodetail: function(index, id) {
				var data = this.list[index].question[id];
				uni.navigateTo({
					url: 'help-detail?data=' + encodeURIComponent(JSON.stringify(data))
				});

			}
		},
	}
</script>

<style>
	* {
		margin: 0;
		padding: 0;
	}

	.content {
		position: absolute;
		width: 100%;
		height: 100%;
		background: rgba(243, 243, 243, 1);
	}

	.item {
		background: rgba(255, 255, 255, 1);
		margin-top: 20upx;
	}

	.title {
		width: 92%;
		margin: auto;
		height: 80upx;
		line-height: 80upx;
		display: flex;
		justify-content: flex-start;
	}

	.icon-css {
		height: 80upx;
		line-height: 80upx;
		font-size: 52upx;
		color: #00D5A2;
	}

	.title text {
		font-size: 36upx;
		color: #333333;
		line-height: 80upx;
		margin-left: 12upx;
	}

	.item_content {
		width: 92%;
		margin: auto;
		border-top: 1px solid rgba(229, 229, 229, 1);
	}

	.item_content_title {
		height: 80upx;
		width: 92%;
		margin-left: 8%;
		display: flex;
		justify-content: flex-start;
	}

	.item_content_title text {
		font-size: 34upx;
		color: #666666;
		line-height: 80upx;
		margin-left: 12upx;
	}

	.icon-css-content {
		height: 80upx;
		line-height: 80upx;
		font-size: 52upx;
		color: #00D5A2;
	}

	.is_show {
		display: none;
	}
</style>
